iT邦幫忙

2023 iThome 鐵人賽

0
SideProject30

sideproject-簡易網站系列 第 26

Day-26 實際使用看看callback function

  • 分享至 

  • xImage
  •  

這邊試用看看兩個例子
https://ithelp.ithome.com.tw/upload/images/20231018/20163238GzDGjXQuvq.png

提取用戶輸入的名字
<form>
    <input type="text" id="username">
    <input type="submit" value="提交" onclick="validateInput(submitCallback)">
</form>

<script>
function validateInput(callback) {
    const username = document.getElementById('username').value;
    if (username) {
        callback(username);
    } else {
        alert('請勿留白');
    }
}

function submitCallback(username) {
    //處理輸入的名字
}
</script>

https://ithelp.ithome.com.tw/upload/images/20231018/20163238eaLlKJDHMt.png

提取定位
<script>
    function getLocation(callback) {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function (position) {
                callback(position.coords.latitude, position.coords.longitude);
            });
        } else {
            console.error('此瀏覽器不支持此功能');
        }
    }
    
    function handleLocation(latitude, longitude) {
        //使用定位訊息
    }
    
    getLocation(handleLocation);
</script>

上一篇
Day-25 JS-callback funtion
下一篇
Day-27 JS陣列
系列文
sideproject-簡易網站30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言